<template>
  <div class="app-container">
    <export-file
      :is-show="editExportVisible"
      :add-path="'/system/resource/importAppend'"
      :cover-path="'/system/staff/export'"
      @changeShow="updateList($event)"
    />

    <el-col :span="3">
      <div class="head-container">
        <el-input
          v-model="deptName"
          :placeholder="$t('operating.pleaseWrite')"
          clearable
          size="small"
          prefix-icon="el-icon-search"
          style="margin-bottom: 20px"
        />
      </div>
      <div class="head-container">
        <el-tree
          ref="tree"
          :data="depData"
          :props="$t('operating.pleaseChosen')"
          :expand-on-click-node="false"
          :filter-node-method="filterNode"
          default-expand-all
          @node-click="handleNodeClick"
        />
      </div>
    </el-col>
    <el-col :span="21" style="padding-left: 10px">
      <el-form
        v-show="showSearch"
        ref="queryForm"
        :model="queryParams"
        :inline="true"
      >
        <el-form-item :label="$t('staff.search')" prop="postName">
          <el-input
            v-model="queryParams.searchValue"
            :placeholder="$t('operating.pleaseWrite')"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>

        <!-- <el-form-item :label="$t('history.deptname')" prop="postCode">
        <treeselect
          v-model="queryParams.param.deptValue"
          :placeholder="$t('operating.pleaseChosen')"
          :show-count="true"
          :maxHeight="600"
          :options="depData"
          :default-expand-level="1"
          @input="nodeClick"
          style="width: 150px; margin-right: 10px"
        >
        </treeselect>
      </el-form-item> -->

        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="handleQuery"
            >{{ $t("operating.search") }}</el-button
          >
          <!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">{{
            $t("operating.reset")
          }}</el-button> -->
        </el-form-item>
      </el-form>

      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            v-hasPermi="['system:staff:add']"
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd"
            >{{ $t("common.caddkey") }}</el-button
          >
        </el-col>

        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="mini"
            :disabled="multiple"
            @click="handleDeleteAll"
            >{{ $t("common.cdelete") }}</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            v-hasPermi="['system:staff:export']"
            type="warning"
            plain
            icon="el-icon-download"
            size="mini"
            @click="handleExport"
            >{{ $t("operating.export") }}</el-button
          >
        </el-col>
        <!-- <el-col :span="1.5">
          <el-button

            type="warning"
            plain
            icon="el-icon-upload2"
            size="mini"
            @click="handleimport"
          >{{ $t("operating.import") }}</el-button>
        </el-col> -->
        <el-col :span="1.5">
          <el-button
            v-hasPermi="['system:staff:template']"
            type="info"
            plain
            icon="el-icon-download"
            size="mini"
            @click="handledownloadExp"
            >{{ $t("staff.downloadExp") }}</el-button
          >
        </el-col>

        <!-- <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"

          @click="handleUpdate"
          v-hasPermi="['system:post:edit']"
        >{{$t('tool.seachCarType')}}</el-button>
      </el-col> -->
        <right-toolbar :show-search.sync="showSearch" @queryTable="getList" />
      </el-row>

      <el-table
        :data="postList"
        class="staffTable"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <!-- <el-table-column type="expand">
            <template slot-scope="props">
              <el-form label-position="left"
                       inline
                       class="demo-table-expand">
                <el-form-item :label="$t('staff.nation')"> <span>{{ props.row.nation }}</span> </el-form-item>
                <el-form-item :label="$t('staff.idNum')"> <span>{{ props.row.idNum }}</span> </el-form-item>
                <el-form-item :label="$t('staff.skill')"> <span>{{ props.row.skill }}</span> </el-form-item>
                <el-form-item :label="$t('staff.batteryTime')"> <span>{{ props.row.batteryTime }}</span> </el-form-item>
                <el-form-item :label="$t('staff.batteryValue')"> <span>{{ props.row.batteryValue }}</span> </el-form-item>
                <el-form-item :label="$t('staff.remark')"> <span>{{ props.row.remark }}</span> </el-form-item>
              </el-form>
            </template>
          </el-table-column> -->
        <!--多选框-->
        <el-table-column type="selection" min-width="50" align="center" />
        <el-table-column
          min-width="100"
          :label="$t('staff.departmentName')"
          prop="departmentName"
        />

        <el-table-column min-width="150" :label="$t('staff.people')">
          <template slot-scope="scope">
            <span
              :style="
                scope.row.onlineState == 0 ? 'color:#E64373' : 'color:#43DAE6'
              "
              >（{{
                scope.row.onlineState == 0
                  ? $t("common.coffline")
                  : $t("common.conline")
              }}）</span
            >{{ scope.row.name }}
          </template>
        </el-table-column>
        <!-- <el-table-column
          min-width="100"
          :label="$t('staff.people')"
          prop="name"
        /> -->
        <el-table-column
          min-width="100"
          :label="$t('staff.sex')"
          prop="sex"
          :formatter="statusFormat"
        />
        <el-table-column
          min-width="100"
          :label="$t('staff.resourceId')"
          prop="resourceId"
        />
        <el-table-column
          min-width="100"
          :label="$t('staff.tagId')"
          prop="tagId"
        />
        <el-table-column
          min-width="120"
          :label="$t('staff.workTypeName')"
          prop="workTypeName"
        />
        <el-table-column
          min-width="120"
          :label="$t('staff.phoneNum')"
          prop="phoneNum"
        />
        <el-table-column
          min-width="150"
          :label="$t('staff.email')"
          prop="email"
        />
        <!-- <el-table-column
          :label="$t('realtime.rateHeart')"
          prop="rateHeart"
        /> -->
        <!-- 在线状态 -->
        <!-- <el-table-column
          min-width="100"
          :label="$t('staff.onlineState')"
          prop="onlineState"
        >
          <template slot-scope="scope">
            <el-button
              icon="el-icon-check"
              :type="scope.row.onlineState === 1 ? 'success' : 'info'"
              circle
            />
          </template>
        </el-table-column> -->

        <!--操作-->
        <el-table-column
          :label="$t('operating.operating')"
          min-width="235"
          fixed="right"
        >
          <template slot-scope="scope">
            <el-button
              v-hasPermi="['system:staff:detail']"
              size="mini"
              type="text"
              icon="el-icon-view"
              @click="seedetails(scope.$index, scope.row)"
              >{{ $t("operating.seeDetails") }}</el-button
            >
            <el-button
              v-hasPermi="['system:staff:edit']"
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleEdit(scope.$index, scope.row)"
              >{{ $t("operating.handle") }}</el-button
            >
            <el-button
              v-hasPermi="['system:staff:delete']"
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              >{{ $t("operating.delete") }}</el-button
            >
            <el-button
              v-hasPermi="['system:staff:call']"
              size="mini"
              type="text"
              icon="el-icon-phone"
              @click="handleCall(scope.row)"
              >{{ $t("operating.call") }}</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />

      <!-- 添加或修改岗位对话框 -->
      <el-dialog :visible.sync="open" width="1000px" append-to-body>
        <el-form ref="form" :model="form" :rules="rules" label-width="120px">
          <el-row>
            <el-col :span="12">
              <!--人员名称-->
              <el-form-item :label="$t('staff.people')" prop="name">
                <el-input
                  v-model="form.name"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <!--人员编号-->
              <el-form-item :label="$t('staff.resourceId')" prop="resourceId">
                <el-input
                  v-model="form.resourceId"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <!--绑定标签-->
              <el-form-item :label="$t('staff.tagId')" prop="tagId">
                <el-input
                  v-model="form.tagId"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--人员性别-->
              <el-form-item :label="$t('staff.sex')" prop="sex">
                <el-select
                  v-model="form.sex"
                  filterable
                  :placeholder="$t('operating.pleaseChosen')"
                >
                  <el-option
                    v-for="item in sexOptions"
                    :key="item.label"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--工种类型-->
              <el-form-item :label="$t('staff.workTypeName')">
                <el-select
                  v-model="form.workTypeId"
                  filterable
                  :placeholder="$t('operating.pleaseChosen')"
                >
                  <el-option
                    v-for="item in workTypeList"
                    :key="item.idx"
                    :label="item.name"
                    :value="item.idx"
                  />
                </el-select>
              </el-form-item>
            </el-col>

            <el-col v-if="!isedit" :span="12">
              <!--负责人电话-->
              <el-form-item :label="$t('staff.phoneNum')" prop="phoneNum">
                <el-input
                  v-model="form.phoneNum"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col v-else :span="12">
              <!--负责人电话-->
              <el-form-item :label="$t('staff.phoneNum')">
                <el-input
                  v-model="form.phoneNum"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col v-if="!isedit" :span="12">
              <!--负责人邮箱-->
              <el-form-item :label="$t('staff.email')" prop="email">
                <el-input
                  v-model="form.email"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>

              <!--职位-->
            </el-col>
            <el-col v-else :span="12">
              <!--负责人邮箱-->
              <el-form-item :label="$t('staff.email')">
                <el-input
                  v-model="form.email"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('staff.nation')" prop="nation">
                <el-input
                  v-model="form.nation"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--技能-->
              <el-form-item :label="$t('staff.skill')" prop="skill">
                <el-input
                  v-model="form.skill"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col v-if="!isedit" :span="12">
              <!--身份证号-->
              <el-form-item :label="$t('staff.idNum')" prop="idNum">
                <el-input
                  v-model="form.idNum"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col v-else :span="12">
              <!--身份证号-->
              <el-form-item :label="$t('staff.idNum')">
                <el-input
                  v-model="form.idNum"
                  :placeholder="$t('operating.pleaseWrite')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item
                :label="$t('staff.departmentName')"
                prop="departmentId"
              >
                <treeselect
                  v-model="form.departmentId"
                  :options="depData"
                  :show-count="true"
                  :placeholder="$t('department.inputmentName')"
                />
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <!--备注-->
              <el-form-item :label="$t('staff.remark')" prop="remark">
                <el-input
                  v-model="form.remark"
                  :placeholder="$t('operating.pleaseWrite')"
                  type="textarea"
                  maxlength="100"
                  :rows="2"
                />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">{{
            $t("operating.determine")
          }}</el-button>
          <el-button @click="cancel">{{ $t("operating.cancel") }}</el-button>
        </div>
      </el-dialog>
      <!-- 查看详情对话框 -->
      <el-dialog :visible.sync="details" width="900px" append-to-body>
        <el-form ref="form" :model="form" :rules="rules" label-width="120px">
          <el-row>
            <el-col :span="12">
              <el-form-item
                :label="$t('staff.departmentName')"
               
                :rules="filter_rules({ required: '请选择部门' })"
              >
                <span>{{ form.departmentName }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--人员名称-->
              <el-form-item
                :label="$t('staff.people')"
           
                :rules="filter_rules({ required: '请输入人员名称' })"
              >
                <span>{{ form.name }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--人员性别-->
              <el-form-item
                :label="$t('staff.sex')"
             
                :rules="filter_rules({ required: '请选择人员性别' })"
              >
                <span>{{ form.sex }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--人员编号-->
              <el-form-item
                :label="$t('staff.resourceId')"
             
                :rules="filter_rules({ required: '请输入人员编号' })"
              >
                <span>{{ form.resourceId }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--绑定标签-->
              <el-form-item
                :label="$t('staff.tagId')"
      
              >
                <span>{{ form.tagId }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--工种类型-->
              <el-form-item :label="$t('staff.workTypeName')">
                <span>{{ form.workTypeName }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--负责人电话-->
              <el-form-item
                :label="$t('staff.phoneNum')"
             
              >
                <span>{{ form.phoneNum }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--负责人邮箱-->
              <el-form-item
                :label="$t('staff.email')"
             
              >
                <span>{{ form.email }}</span>
              </el-form-item>
              <!--职位-->
            </el-col>
            <el-col :span="12">
              <el-form-item
                :label="$t('staff.nation')"
          
              >
                <span>{{ form.nation }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--技能-->
              <el-form-item
                :label="$t('staff.skill')"
        
              >
                <span>{{ form.skill }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!--身份证号-->
              <el-form-item
                :label="$t('staff.idNum')"
           
              >
                <span>{{ form.idNum }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <!--备注-->
              <el-form-item
                :label="$t('staff.remark')"
           
              >
                <span>{{ form.remark }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="details = false">{{
            $t("operating.cancel")
          }}</el-button>
        </div>
      </el-dialog>
      <!-- 紧急呼叫对话框 -->
      <el-dialog
        :visible.sync="emergencyCall"
        width="900px"
        append-to-body
        :title="$t('operating.call')"
        :show-close="false"
      >
        <el-form ref="form" :model="form" :rules="rules" label-width="120px">
          <el-form-item :label="$t('operating.call')">
            <el-input v-model="callName" />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="danger" @click="submitMessage">{{
            $t("operating.determine")
          }}</el-button>
          <el-button
            @click="
              emergencyCall = false;
              callName = null;
            "
            >{{ $t("operating.cancel") }}</el-button
          >
        </div>
      </el-dialog>
    </el-col>
  </div>
</template>

<script>
import AES from "@/utils/aes.js";
import { baseUrl } from "@/utils/global";
import { treeselect } from "@/api/system/dept";
import { getToken } from "@/utils/auth";
import i18n from "@/utils/lang/index";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import exportFile from "@/components/exportFile/exportFile";
import {
  findPageStaff,
  department,
  resourcedelete,
  departmentlist,
  workTypeAll,
  resourcesave,
  emergencyCall,
  editsave,
} from "@/api/system/staff";
export default {
  name: "Post",
  components: { Treeselect, exportFile },
  data() {
    return {
      isedit: false,

      callName: null,
      emergencyCall: false,
      editExportVisible: false,
      sexOptions: [
        {
          value: "男",
          label: "男",
        },
        {
          value: "女",
          label: "女",
        },
      ],
      deptName: null,
      deptValue: null,
      depData: [],
      details: false,
      deptSelect: null,
      Idx: null,
      workTypeList: [],
      tableHeight: window.innerHeight - 400,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 岗位表格数据
      postList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 状态数据字典
      statusOptions: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        searchValue: null,
        departmentId: undefined,
      },
      resourceId: null,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        sex: [{ required: true, message: "性别不能为空", trigger: "blur" }],
        departmentId: [
          { required: true, message: "部门不能为空", trigger: "blur" },
        ],
        name: [{ required: true, message: "姓名不能为空", trigger: "blur" }],
        resourceId: [
          { required: true, message: "人员编号不能为空", trigger: "blur" },
        ],
        phoneNum: [
          {
            required: false,
            message: "电话号码格式错误",
            trigger: "blur",
            pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/,
          },
        ],
        idNum: [
          {
            required: false,
            message: "身份证号码格式错误",
            trigger: "blur",
            pattern:
              /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
          },
        ],
        email: [
          {
            required: false,
            message: "邮箱格式错误",
            trigger: "blur",
            pattern: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/,
          },
        ],
      },
    };
  },
  watch: {
    // 根据名称筛选部门树
    deptName(val) {
      this.$refs.tree.filter(val);
    },
  },
  created() {
    this.getList();
    this.deparlist();
    this.getDicts("sys_user_sex").then((response) => {
      this.sexOptions = this.Dictionary(response.data);
      console.log(this.sexOptions);
    });
  },
  methods: {
    // 字典状态字典翻译
    statusFormat(row, column) {
      return this.selectlable(this.sexOptions, row.sex);
    },
    handleimport() {
      this.editExportVisible = true;
    },
    updateList(e) {
      this.editExportVisible = e;
      this.getList();
      this.deparlist();
    },
    handleNodeClick(val) {
      console.log(val);
      this.queryParams.departmentId = val.id;
      this.getList();
    },
    // 筛选节点
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    //  获取部门列表
    getDept() {
      departmentlist().then((response) => {
        console.log(response);
        this.deptSelect = response.data;
      });
    },
    //  获取工种列表
    getWorkTypeList() {
      workTypeAll().then((response) => {
        this.deptSelect = response.data;
        const obj = { idx: 0, name: "不设置" };
        this.deptSelect.unshift(obj);
        this.workTypeList = this.deptSelect;
      });
    },
    deparlist() {
      treeselect().then((response) => {
        this.depData = response.data;
      });
    },
    nodeClick(val) {
      const self = this;
      // 可将地图的ID设置为树结构的ID，通过点击节点，来切换地图
      this.queryParams.departmentId = val;
      // this.getStaffList();
    },
    // 导出所有
    // reportAll() {
    //   if (this.queryParams.departmentId) {
    //     window.location.href =
    //       baseUrl +
    //       '/resource/reportAll?departmentId=' +
    //       this.queryParams.departmentId +
    //       '&token=' +
    //       Cookie.get('token')
    //   } else {
    //     window.location.href =
    //       baseUrl + '/resource/reportAll?token=' + Cookie.get('token')
    //   }
    // },
    // 下载模版
    handledownloadExp() {
      window.location.href = `${baseUrl}/system/resource/getTemplates?token=${getToken()}`;
    },
    // 查看
    seedetails(index, row) {
      this.details = true;
      this.getDept();
      this.getWorkTypeList();
      editsave(row.idx).then((response) => {
        this.title = "职工";

        this.form = response.data;

        this.form.sex = this.selectlable(this.sexOptions, response.data.sex);
      });
      // this.getDept()
      // this.getWorkTypeList()
      // if (this.$refs['form'] !== undefined) {
      //   this.$refs['form'].resetFields()
      // }
      // this.selectIndex = index

      // this.form = {
      //   departmentId: row.departmentName,
      //   idx: row.idx,
      //   tagId: row.tagId,
      //   name: row.name,
      //   sex: this.selectlable(this.sexOptions, row.sex),
      //   phoneNum: row.phoneNum,
      //   email: row.email,
      //   nation: row.nation,
      //   skill: row.skill,
      //   idNum: row.idNum,
      //   remark: row.remark,
      //   workTypeId: row.workTypeName
      // }
    },
    /** 查询岗位列表 */
    getList() {
      console.log(i18n.t("operating.pleaseWrite"));
      this.loading = true;

      findPageStaff(this.queryParams).then((response) => {
        this.postList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },

    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        departmentId: undefined,
        idx: undefined,
        tagId: undefined,
        name: undefined,
        sex: undefined,
        phoneNum: undefined,
        email: undefined,
        nation: undefined,
        skill: undefined,
        idNum: undefined,
        remark: undefined,
        workTypeId: undefined,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      (this.queryParams.pageNum = 1),
        (this.queryParams.pageSize = 10),
        // this.queryParams = {

        //   searchValue: null,
        //   departmentId: undefined

        // },

        this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      // this.ids = selection.map((item) => item.postId)
      this.ids = selection.map((item) => {
        return {
          idx: item.idx,
        };
      });
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.isedit = false;
      this.title = "添加职工";
      this.getDept();
      this.getWorkTypeList();
    },
    /** 修改按钮操作 11*/
    // handleUpdate(row) {

    //   this.reset()
    //   const postId = row.postId || this.ids
    //   getPost(postId).then((response) => {
    //     this.form = response.data
    //     this.open = true
    //     this.title = '修改岗位'
    //   })
    // },
    // 编辑
    handleEdit(index, row) {
      this.getDept();
      this.getWorkTypeList();
      this.resetForm("form");
      editsave(row.idx).then((response) => {
        this.Idx = row.idx;
        this.open = true;
        this.isedit = true;
        this.title = "编辑职工";

        this.form = response.data;
      });

      // if (this.$refs['form'] !== undefined) {
      //   this.$refs['form'].resetFields()
      // }
      // this.selectIndex = index

      // this.form = {
      //   departmentId: row.departmentId,
      //   idx: row.idx,
      //   tagId: row.tagId,
      //   name: row.name,
      //   sex: row.sex,
      //   phoneNum: row.phoneNum,
      //   email: row.email,
      //   nation: row.nation,
      //   skill: row.skill,
      //   resourceId: row.resourceId,
      //   idNum: row.idNum,
      //   remark: row.remark,
      //   workTypeId: row.workTypeId
      // }
      // 设置编辑框为可见状态
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          let ids = "";
          let phs = "";
          let ems = "";
          if (this.form.idNum) {
            ids = AES.encrypt(this.form.idNum);
          }
          if (this.form.phoneNum) {
            phs = AES.encrypt(this.form.phoneNum);
          }
          if (this.form.email) {
            ems = AES.encrypt(this.form.email);
          }

          if (this.title !== "编辑职工") {
            const param = {
              resourceId: this.form.resourceId,
              name: this.form.name,
              sex: this.form.sex,
              phoneNum: phs,
              email: ems,
              nation: this.form.nation,
              skill: this.form.skill,
              idNum: ids,
              remark: this.form.remark,
              tagId: this.form.tagId,
              departmentId: this.form.departmentId,
              type: "staff",
              workTypeId:
                this.form.workTypeId === undefined || this.form.workTypeId === 0
                  ? 0
                  : this.form.workTypeId,
            };

            resourcesave(param).then((response) => {
              if (response.code == "200") {
                this.msgSuccess(response.msg);
                this.open = false;
                this.getList();
              } else {
                this.msgError(response.msg);
              }
            });
          } else {
            const param = {
              resourceId: this.form.resourceId,
              name: this.form.name,
              sex: this.form.sex,
              phoneNum: phs,
              email: ems,
              nation: this.form.nation,
              skill: this.form.skill,
              idNum: ids,
              remark: this.form.remark,
              tagId: this.form.tagId,
              departmentId: this.form.departmentId,
              type: "staff",
              idx: this.Idx,
              workTypeId:
                this.form.workTypeId === undefined || this.form.workTypeId === 0
                  ? 0
                  : this.form.workTypeId,
            };
            resourcesave(param).then((response) => {
              if (response.code == "200") {
                this.msgSuccess(response.msg);
                this.open = false;
                this.getList();
              } else {
                this.msgError(response.msg);
              }
            });
          }
        }
      });
    },

    handleDeleteAll() {
      this.delStaff(this.ids);
    },

    /** 删除按钮操作 */
    handleDelete(row) {
      const postIds = [];
      postIds.push({ idx: row.idx });
      this.delStaff(postIds);
    },

    delStaff(postIds) {
      const that = this;
      this.$confirm(i18n.t("sxm.delTipItem"), i18n.t("menuManage.title"), {
        confirmButtonText: i18n.t("operating.determine"),
        cancelButtonText: i18n.t("operating.cancel"),
        type: "warning",
      })
        .then(function () {
          resourcedelete(postIds).then((response) => {
            if (response.code == 200) {
              that.getList();
              that.msgSuccess(response.msg);
            } else {
              that.msgError(response.msg);
            }
          });
        })
        .then(() => {});
    },

    handleCall(row) {

      this.emergencyCall = true;
      this.resourceId = row.resourceId;
    },
    submitMessage() {
      const parm = {
        resourceId: this.resourceId,
        des: this.callName,
      };
      emergencyCall(parm).then((response) => {
   
        this.emergencyCall = false;
      });
    },
    closeDialog() {
      alert(5);
      this.callName = null;
    },
    //
    /** 导出按钮操作 */
    handleExport() {
      this.getdownload(
        "system/staff/export",
        {},
        `post_${new Date().getTime()}.xls`
      );
    },
  },
};
</script>

<style scoped lang="scss">
::v-deep .el-tree-node__label {
  overflow: hidden;
}
::v-deep.el-input__inner {
  height: 40px !important;
}
</style>

